<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <!-- 百度禁止转码 -->
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrai">
    <!-- 禁用电话号码邮箱自动识别 -->
    <meta name="format-detection" content="telephone=no,email=no">
    <title>document</title>
    <style>
      .menu {
        color: #333;
        width: 50px;
        height: 10px;
        border-top: 30px double;
        border-bottom: 10px solid;
      }
      .add {
        margin-top: 100px;
        width: 200px;
        height: 200px;
        color: #999;
        border: 3px dashed;
        position: relative;
        transition: color .3s;
      }
      .add::before,
      .add::after {
        position: absolute;
        content: '';
        left: 50%;
        top: 50%;
      }
      .add::before {
        border-top: 5px solid;
        width: 50px;
        margin: -2.5px 0 0 -25px;
      }
      .add::after {
        border-left: 5px solid;
        height: 50px;
        margin: -25px 0 0 -2.5px;
      }
      .add:hover {
        color: #333;
      }
    </style>
  </head>

  <body>
    <div class="menu"></div>
    <div class="add">
    </div>
  </body>
</html>